<template>
    <view>
        <view class="uni-list" v-for="(value, key) in listData" :key="key" @click="goDetail(value)">
                <view class="uni-media-list">
                    <image class="uni-media-list-logo" :src="value.cover"></image>
                    <view class="uni-media-list-body">
                        <view class="uni-media-list-text-top">{{ value.title }}</view>
                        <view class="uni-media-list-text-bottom">
                            <text>{{ value.place}}</text>
                            <text>{{ value.start_time}}</text>
                        </view>
                    </view>
                </view>
        </view>
    </view>
</template>

<script>
    
    export default {
        data() {
            return {
                listData: [{
                        id: "109121",                       
                        title: "相亲活动一",
                        place: "重庆",
                        cover: "https://img.36krcdn.com/20191230/v2_37635ef22df24e96aa7f26e192036c2b_img_png",
                        start_time: "2023-12-30 15:20:00",
						end_time:"2023-12-30 15:20:00"
                    },
                    {
                        id: "109121",                       
                        title: "相亲活动二",
                        place: "重庆",
                        cover: "https://img.36krcdn.com/20191230/v2_02c342a62f91498b99c7f2b5aa22ff1c_img_png",
                        start_time: "2023-12-30 15:22:00",
						end_time:"2023-12-30 15:20:00"
                    },
                    {
                        id: "109121",
                        title: "相亲活动三",
                        place: "重庆",
                        cover: "https://img.36krcdn.com/20191230/v2_43cbd298bed24a18bd023802258f20c8_img_png",
                        start_time: "2023-12-30 15:26:00",
						end_time:"2023-12-30 15:20:00"
                    },
                    {
                        id: "109121",
                        title: "相亲活动四",
                        place: "重庆", 
                        cover: "https://img.36krcdn.com/20191230/v2_037f7f799f504a60a848b52fa913ab65_img_png",
                        start_time: "2023-12-30 15:29:00",
						end_time:"2023-12-30 15:20:00"
                    }
                ],
            };
        },
        onLoad() {
        },
        methods: {
            goDetail: function(e) {
                let detail = {
                    author_name: e.author_name,
                    cover: e.cover,
                    id: e.id,
                    
                    start_time: e.start_time,
					end_time: e.end_time,
                    title: e.title
                };
                uni.navigateTo({
                    url: 'detail?detailDate=' + encodeURIComponent(JSON.stringify(detail))
                });
            },
        }
    };
</script>
<style>
	.uni-list{
		border-radius: 20rpx;
		margin: 20rpx 20rpx 0;
		background-color: #ffffff;
	}
	.uni-media-list{
		display: flex;
		flex-direction: row;
		justify-content: space-between;
	}
    .uni-media-list-logo {
		width: 300rpx;
		height: 150rpx;
		border-radius: 20rpx;
    }
	.uni-media-list-body{
		margin: 0 30rpx;
		height: auto;
		flex: 1;
		font-size: 22rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
	}

    .uni-media-list-text-top {
        height: 74upx;
        font-size: 28upx;
        overflow: hidden;
    }

    .uni-media-list-text-bottom {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
    }
</style>

